<template>
  <div class="centers diolog_adapt">
    <el-form :model="addForm" ref="auditForm" :rules="rules">
      <el-form-item label="用户名称:" label-width="140px">
        <el-input v-model="userName" autocomplete="off" disabled></el-input>
      </el-form-item>
      <el-form-item label="型号选择:" label-width="140px" prop="thereId">
        <el-select v-model="addForm.thereId" placeholder="没有选中任何项" @change="thereIdChange" style="width:100%">
          <el-option v-for="item in lotoptions" :key="item.id" :label="item.name_code" :value="item.id"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="需求类型:" label-width="140px" prop="demand_type">
        <el-select v-model="addForm.demand_type" placeholder="没有选中任何项" style="width:100%">
          <el-option v-for="item in condition" :key="item.id" :label="item.name" :value="item.name"></el-option>
        </el-select>
      </el-form-item>
      <div class="flex flex_bet">
        <el-form-item label="期望完成日期:" label-width="140px" prop="expect_time" class="boxitem">
          <el-date-picker v-model="addForm.expect_time" type="date" placeholder="选择日期" :picker-options="pickerOptions0" format="yyyy 年 MM 月 dd 日" value-format="timestamp">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="计划完成日期:" label-width="140px" prop="plan_time" class="boxitem">
          <el-date-picker v-model="addForm.plan_time" type="date" placeholder="选择日期" :picker-options="pickerOptions0" format="yyyy 年 MM 月 dd 日" value-format="timestamp">
          </el-date-picker>
        </el-form-item>
      </div>
      <!-- <div v-for="(item,index) in addForm.deliver" :key="index">
        <el-form-item :label="`匹配硬件版本${index + 1}`" label-width="140px">
          <el-input v-model="item.name_code" autocomplete="off" :placeholder="`请输入匹配硬件版本${index + 1}`"></el-input>
        </el-form-item>
      </div> -->
      <el-form-item label="匹配硬件版本1/2/3" label-width="140px">
        <el-select v-model="addForm.deliver" placeholder="没有选中任何项" multiple style="width:100%">
          <el-option v-for="item in fiveBox" :key="item.id" :label="item.name_code" :value="item.name_code"></el-option>
        </el-select>
      </el-form-item>
      <div class="flex flex_bet" v-if="hardwareShow">
        <div style="width:49%">
          <el-form-item label="型号:" label-width="140px" class="boxitem">
            <el-input v-model="hardwareDate.name" autocomplete="off" disabled></el-input>
          </el-form-item>
          <el-form-item label="CPU:" label-width="140px" class="boxitem">
            <el-input v-model="hardwareDate.cpu" autocomplete="off" disabled></el-input>
          </el-form-item>
          <el-form-item label="运存RAM:" label-width="140px" class="boxitem">
            <el-input v-model="hardwareDate.start_ram" autocomplete="off" disabled></el-input>
          </el-form-item>
          <el-form-item label="存储ROM:" label-width="140px" class="boxitem">
            <el-input v-model="hardwareDate.storage_rom" autocomplete="off" disabled></el-input>
          </el-form-item>
          <el-form-item label="显示屏:" label-width="140px" class="boxitem">
            <el-input v-model="hardwareDate.display" autocomplete="off" disabled></el-input>
          </el-form-item>
          <el-form-item label="触摸屏:" label-width="140px" class="boxitem">
            <el-input v-model="hardwareDate.touch_screen" autocomplete="off" disabled></el-input>
          </el-form-item>
          <el-form-item label="前摄像头:" label-width="140px" class="boxitem">
            <el-input v-model="hardwareDate.prefix_camera" autocomplete="off" disabled></el-input>
          </el-form-item>
          <el-form-item label="后摄像头:" label-width="140px" class="boxitem">
            <el-input v-model="hardwareDate.suffix_camera" autocomplete="off" disabled></el-input>
          </el-form-item>
          <el-form-item label="电池:" label-width="140px" class="boxitem">
            <el-input v-model="hardwareDate.battery" autocomplete="off" disabled></el-input>
          </el-form-item>
          <el-form-item label="其他特殊说明:" label-width="140px" class="boxitem">
            <el-input v-model="hardwareDate.other" autocomplete="off" disabled></el-input>
          </el-form-item>
        </div>
        <div style="width:49%">
          <el-form-item label="型号:" label-width="140px" class="boxitem">
            <el-input v-model="alterHardware.name" autocomplete="off" disabled></el-input>
          </el-form-item>
          <el-form-item label="CPU:" label-width="140px" class="boxitem">
            <el-input v-model="alterHardware.cpu" autocomplete="off" disabled></el-input>
          </el-form-item>
          <el-form-item label="运存RAM:" label-width="140px" class="boxitem">
            <el-input v-model="alterHardware.start_ram" autocomplete="off" disabled></el-input>
          </el-form-item>
          <el-form-item label="存储ROM:" label-width="140px" class="boxitem">
            <el-input v-model="alterHardware.storage_rom" autocomplete="off" disabled></el-input>
          </el-form-item>
          <el-form-item label="显示屏:" label-width="140px" class="boxitem">
            <el-input v-model="alterHardware.display" autocomplete="off" disabled></el-input>
          </el-form-item>
          <el-form-item label="触摸屏:" label-width="140px" class="boxitem">
            <el-input v-model="alterHardware.touch_screen" autocomplete="off" disabled></el-input>
          </el-form-item>
          <el-form-item label="前摄像头:" label-width="140px" class="boxitem">
            <el-input v-model="alterHardware.prefix_camera" autocomplete="off" disabled></el-input>
          </el-form-item>
          <el-form-item label="后摄像头:" label-width="140px" class="boxitem">
            <el-input v-model="alterHardware.suffix_camera" autocomplete="off" disabled></el-input>
          </el-form-item>
          <el-form-item label="电池:" label-width="140px" class="boxitem">
            <el-input v-model="alterHardware.battery" autocomplete="off" disabled></el-input>
          </el-form-item>
          <el-form-item label="其他特殊说明:" label-width="140px" class="boxitem">
            <el-input v-model="alterHardware.other" autocomplete="off" disabled></el-input>
          </el-form-item>
        </div>
      </div>
      <div class="flex flex_bet">
        <div style="width:49%">
          <el-form-item label="开机LOGO:" label-width="140px">
            <el-input v-model="alterAdd.start_logo" autocomplete="off" placeholder="请上传开机logo图" disabled></el-input>
          </el-form-item>
          <el-form-item label="开机动画:" label-width="140px">
            <el-input v-model="alterAdd.start_animation" autocomplete="off" placeholder="请上传开机动画" disabled></el-input>
          </el-form-item>
          <el-form-item label="开机铃声:" label-width="140px">
            <el-input v-model="alterAdd.start_ring" autocomplete="off" placeholder="请输入开机铃声格式" disabled></el-input>
          </el-form-item>
          <el-form-item label="默认壁纸:" label-width="140px">
            <el-input v-model="alterAdd.wallpaper" autocomplete="off" placeholder="请上传默认壁纸" disabled></el-input>
          </el-form-item>
          <el-form-item label="应用内置需求:" label-width="140px">
            <el-input v-model="alterAdd.app_demand" autocomplete="off" placeholder="请输入应用内置需求" disabled></el-input>
          </el-form-item>
          <el-form-item label="Launcher桌面需求:" label-width="140px">
            <el-input v-model="alterAdd.launcher_desktop" autocomplete="off" placeholder="请输入Launcher桌面需求" disabled></el-input>
          </el-form-item>
          <el-form-item label="系统语言需求:" label-width="140px">
            <el-input v-model="alterAdd.language" autocomplete="off" placeholder="请输入系统语言需求" disabled></el-input>
          </el-form-item>
          <el-form-item label="系统输入法需求:" label-width="140px">
            <el-input v-model="alterAdd.type_writing" autocomplete="off" placeholder="请输入系统输入法需求" disabled></el-input>
          </el-form-item>
          <el-form-item label="OTA升级需求:" label-width="140px">
            <el-input v-model="alterAdd.ota_demand" autocomplete="off" placeholder="请输入OTA升级需求" disabled></el-input>
          </el-form-item>
          <el-form-item label="其他需求补充:" label-width="140px">
            <el-input v-model="alterAdd.other_demand" autocomplete="off" placeholder="其他需求补充或直接导入xlsx表格" style="flex:1" disabled></el-input>
          </el-form-item>
        </div>
        <div style="width:49%">
          <el-form-item label="审核意见:" label-width="140px">
            <div class="addPut">
              <el-input v-model="addForm.start_logo" autocomplete="off" placeholder="默认为无特殊需求，否则请上传开机LOGO图" disabled></el-input>
              <el-upload :action="`${uploadLink}api/custom/uploadCustom`" class="upload-demo uploadBtn" :data="pdfData" :show-file-list="false" :on-success="uploadSelect">
                <el-button size="mini">上传</el-button>
              </el-upload>
            </div>
          </el-form-item>
          <el-form-item label="审核意见:" label-width="140px">
            <div class="addPut">
              <el-input v-model="addForm.start_animation" autocomplete="off" placeholder="默认为无特殊需求，否则请上传开机动画图" disabled></el-input>
              <el-upload :action="`${uploadLink}api/custom/uploadCustom`" class="upload-demo uploadBtn" :data="pdfData" :show-file-list="false" :on-success="uploadingAnimation">
                <el-button size="mini">上传</el-button>
              </el-upload>
            </div>
          </el-form-item>
          <el-form-item label="审核意见:" label-width="140px">
            <el-input v-model="addForm.start_ring" autocomplete="off" placeholder="默认为无开机铃声需求，否则请上传开机铃声"></el-input>
          </el-form-item>
          <el-form-item label="审核意见:" label-width="140px">
            <div class="addPut">
              <el-input v-model="addForm.wallpaper" autocomplete="off" placeholder="默认为无壁纸指定需求，否则请上传壁纸" disabled></el-input>
              <el-upload :action="`${uploadLink}api/custom/uploadCustom`" class="upload-demo uploadBtn" :data="pdfData" :show-file-list="false" :on-success="uploadWallpaper">
                <el-button size="mini">上传</el-button>
              </el-upload>
            </div>
          </el-form-item>
          <el-form-item label="审核意见:" label-width="140px">
            <el-input v-model="addForm.app_demand" autocomplete="off" placeholder="默认为无内置应用需求，否则请输入应用包名"></el-input>
          </el-form-item>
          <el-form-item label="审核意见:" label-width="140px">
            <el-input v-model="addForm.launcher_desktop" autocomplete="off" placeholder="请输入Launcher桌面需求"></el-input>
          </el-form-item>
          <el-form-item label="审核意见:" label-width="140px">
            <el-input v-model="addForm.language" autocomplete="off" placeholder="请输入系统语言需求"></el-input>
          </el-form-item>
          <el-form-item label="审核意见:" label-width="140px">
            <el-input v-model="addForm.type_writing" autocomplete="off" placeholder="请输入系统输入法需求"></el-input>
          </el-form-item>
          <el-form-item label="审核意见:" label-width="140px">
            <el-input v-model="addForm.ota_demand" autocomplete="off" placeholder="请输入OTA升级需求"></el-input>
          </el-form-item>
          <el-form-item label="审核意见:" label-width="140px">
            <div class="addPut">
              <el-input v-model="addForm.other_demand" autocomplete="off" placeholder="其他需求补充或直接导入xlsx表格" style="flex:1"></el-input>
              <el-upload class="upload-demo uploadBtn" accept=".xlsx,.xls" :action="`${uploadLink}api/custom/uploadCustom`" :show-file-list="false" :data="pdfData" :on-success="unloadXlsx">
                <el-button size="mini">上传</el-button>
              </el-upload>
            </div>
          </el-form-item>
        </div>
      </div>
    </el-form>
  </div>
</template>

<script>
import { getCreateDigits, digitsThereGetFirmware, getCreateDigitsFive } from "@/api/snControl.js";
import { queryIdFirmwareCustom, examineFirmwareCustom } from "@/api/firmware.js";
export default {
  props: {
    auditId: {
      type: Number,
      default() {
        return 1
      }
    }
  },
  watch: {
    auditId(newVal, oldVal) {
      this.getqueryIdFirmwareCustom(newVal)
    }
  },
  data() {
    return {
      //型号选择：第3/4位选择框
      lotoptions: [],
      //需求选择框
      condition: [{ id: 1, name: '新创需求' }, { id: 2, name: '补充需求' }, { id: 3, name: '解BUG' }],
      //限制日期选择框范围
      pickerOptions0: {
        disabledDate(time) {
          return time.getTime() < Date.now() - 8.64e7;
        }
      },
      //硬件数据
      hardwareDate: {},
      //硬件视图
      hardwareShow: false,
      alterHardware: {},
      alterAdd: {},
      pdfData: { userId: localStorage.getItem("ID"), last_ip: sessionStorage.getItem("Ip") },
      addForm: {
        userId: localStorage.getItem("ID"), last_ip: sessionStorage.getItem("Ip"), id: '', thereId: '', demand_type: '', expect_time: '', plan_time: '', start_logo: '', start_animation: '', start_ring: '',
        wallpaper: '', app_demand: '', launcher_desktop: '', language: '', type_writing: '', ota_demand: '', other_demand: '', deliver: []
      },
      rules: {
        thereId: [{ required: true, message: "请选择型号", trigger: "blur" }],
        demand_type: [{ required: true, message: "请输入需求类型", trigger: "blur" }],
        expect_time: [{ required: true, message: "请选择期望完成时间", trigger: "blur" }],
        plan_time: [{ required: true, message: "请选择计划完成时间", trigger: "blur" }],
        start_logo: [{ required: true, message: "请上传开机logo图", trigger: "blur" }],
        start_animation: [{ required: true, message: "请上传开机动画", trigger: "blur" }],
        start_ring: [{ required: true, message: "请输入开机铃声格式", trigger: "blur" }],
        wallpaper: [{ required: true, message: "请上传默认壁纸", trigger: "blur" }],
        app_demand: [{ required: true, message: "请输入应用内置需求", trigger: "blur" }],
        launcher_desktop: [{ required: true, message: "请输入Launcher桌面需求", trigger: "blur" }],
        language: [{ required: true, message: "请输入系统语言需求", trigger: "blur" }],
        type_writing: [{ required: true, message: "请输入输入法", trigger: "blur" }],
        ota_demand: [{ required: true, message: "请输入OTA升级需求", trigger: "blur" }]
      },
      //用户名
      userName: '',
      uploadLink: process.env.VUE_APP_BASE_API,
      fiveBox: []
    }
  },
  created() {
    this.getCreateDigitss(3)
    // console.log('我是子组件的生命周期', this.auditId)
    this.getqueryIdFirmwareCustom(this.auditId)
  },
  beforeDestroy() {
    this.$refs.auditForm.resetFields();
    this.addForm = this.$options.data().addForm
    this.hardwareShow = false
  },
  methods: {
    //审核定制固件需求
    getexamineFirmwareCustom() {
      this.$refs.auditForm.validate(valid => {
        if (valid) {
          let addForm = JSON.parse(JSON.stringify(this.addForm))
          let deliver = addForm.deliver.map(item => ({ name_code: item }))
          addForm.expect_time = addForm.expect_time / 1000
          addForm.plan_time = addForm.plan_time / 1000
          addForm.deliver = JSON.stringify(deliver)
          addForm.id = this.auditId
          examineFirmwareCustom(addForm).then(res => {
            this.$message.success(res.msg)
            this.$emit('getqueryFirmwareCustom')
            this.$emit('closeAudit')
          }).catch(err => {
            this.$emit('closeAudit')
          })
        } else {
          return false
        }
      })
    },
    //需求导入表格
    unloadXlsx(res) {
      if (res.code == 200) {
        this.addForm.other_demand = res.data.filePath
      } else {
        this.$message.error(res.msg)
      }
    },
    //上传开机动画
    uploadingAnimation(res) {
      if (res.code == 200) {
        this.addForm.start_animation = res.data.filePath
      } else {
        this.$message.error(res.msg)
      }
    },
    //上传开机LOGO图
    uploadSelect(res) {
      if (res.code == 200) {
        this.addForm.start_logo = res.data.filePath
      } else {
        this.$message.error(res.msg)
      }
    },
    //上传壁纸
    uploadWallpaper(res) {
      if (res.code == 200) {
        this.addForm.wallpaper = res.data.filePath
      } else {
        this.$message.error(res.msg)
      }
    },
    //型号选择change事件
    thereIdChange(val) {
      console.log('cnage事件', val)
      this.getdigitsThereGetFirmware(val)
      this.getCreateDigitsFives(val)
    },
    //第三位数编号获取固件信息
    getdigitsThereGetFirmware(id) {
      digitsThereGetFirmware({ thereId: id }).then(res => {
        this.alterHardware = res.data
      }).catch(err => {
        this.alterHardware = []
      })
    },
    getCreateDigitsFives(id) {
      getCreateDigitsFive({ thereId: id }).then(res => {
        this.fiveBox = res.data
      }).catch(err => {
        this.fiveBox = []
      })
    },
    //根据ID获取定制固件信息审核意见
    getqueryIdFirmwareCustom(id) {
      queryIdFirmwareCustom({ id: id }).then(res => {
        this.alterAdd = res.data
        this.userName = res.data.username
        this.addForm.demand_type = res.data.demand_type
        this.addForm.thereId = res.data.dId
        this.addForm.expect_time = res.data.expect_time * 1000
        this.digitsThereGetFirmwares(res.data.dId)
        this.getCreateDigitsFives(res.data.dId)
        console.log('根据ID获取定制固件信息审核意见', res.data)
      }).catch(err => { })
    },
    //第三位数编号获取固件信息
    digitsThereGetFirmwares(id) {
      digitsThereGetFirmware({ thereId: id }).then(res => {
        this.hardwareDate = res.data
        this.hardwareShow = true
      }).catch(err => {
        this.hardwareDate = []
        this.hardwareShow = false
      })
    },
    //获取1、2、3位数信息
    getCreateDigitss(type) {
      getCreateDigits({ type: type }).then(res => {
        this.lotoptions = res.data
      }).catch(err => {
        this.lotoptions = []
      })
    }
  }
}
</script>

<style scoped>
/deep/ .el-date-editor.el-input,
.el-date-editor.el-input__inner {
  width: 100%;
}

.uploadBtn {
  position: absolute;
  top: 0;
  right: 10px;
}
</style>